<%@ page import="com.party.core.model.system.TargetType" %>
<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="../include/tag.jsp" %>
<!DOCTYPE html>
<html lang="zh">
<head>
    <title>${empty coupon.id ? '发布' : '编辑'}票券</title>
    <%@include file="../include/commonFile.jsp" %>
    <link rel="stylesheet" href="${ctx}/css/common/list.css">
    <link rel="stylesheet" href="${ctx}/css/ui/activity/publish_form.css">
</head>
<body>
<!--头部-->
<%@include file="../include/header.jsp" %>
<div class="index-outside">
    <%@include file="../include/sidebar.jsp" %>
    <!--内容-->
    <section>
        <div class="section-main">
            <!-- 正文请写在这里 -->
            <div class="add-form-content">
                <form id="myForm" class="layui-form mt20" method="post" action="${ctx}/coupon/coupon/save.do">
                    <div class="layui-form-item">
                        <label class="layui-form-label">名称<span class="f-verify-red">*</span></label>
                        <div class="layui-input-block">
                            <input type="text" name="name" lay-verify="name" autocomplete="off" placeholder="票券名称" class="layui-input" value="${coupon.name}">
                            <input type="hidden" name="id" value="${coupon.id}"/>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">图片<span class="f-verify-red">*</span></label>
                        <div class="cover-content">
                            <input type="hidden" name="pic" id="pic" lay-verify="pic" value="${coupon.pic}"/>
                            <c:if test="${coupon == null || empty coupon.pic}">
                                <span id="cover-img" class="cover-img" style="background-image:url(${ctx}/image/posterImg.png)"></span>
                            </c:if>
                            <c:if test="${coupon != null && not empty coupon.pic}">
                                <span id="cover-img" class="cover-img" style="background-image:url('${coupon.pic}')"></span>
                            </c:if>
                            <a class="layui-btn layui-btn-danger" id="sel_pic_img">+添加海报</a>
                            <div class="form-word-aux">建议尺寸：800x450</div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">基本说明<span class="f-verify-red">*</span></label>
                        <div class="layui-input-block">
                            <textarea name="remarks" placeholder="基本说明" lay-verify="remarks" class="layui-textarea">${coupon.remarks}</textarea>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">概要说明<span class="f-verify-red">*</span></label>
                        <div class="layui-input-block">
                            <textarea name="explain" placeholder="概要说明" lay-verify="explain" class="layui-textarea">${coupon.explain}</textarea>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label">有效期<span class="f-verify-red">*</span></label>
                            <div class="layui-input-inline">
                                <input class="layui-input" name="startDate" lay-verify="startDate" placeholder="开始时间" id="startTime" readonly
                                       value='<fmt:formatDate value="${coupon.startTime}" pattern="yyyy-MM-dd" />'
                                />
                            </div>
                            <div class="layui-input-inline" style="width: 10px; margin-top: 8px; margin-left: 2px;">至</div>
                            <div class="layui-input-inline">
                                <input class="layui-input" name="endDate" lay-verify="endDate" placeholder="结束时间" id="endTime" readonly
                                       value='<fmt:formatDate value="${coupon.endTime}" pattern="yyyy-MM-dd" />'
                                />
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-input-block">
                            <a href="javascript:void(0)" class="layui-btn layui-btn-danger" lay-submit lay-filter="*">立即提交</a>
                            <a href="${ctx}/coupon/coupon/list.do" class="layui-btn layui-btn-primary">取消</a>
                        </div>
                    </div>
                </form>
            </div>
        </div><!--底部-->
        <%@include file="../include/footer.jsp" %>
    </section>
</div>
<script>
    var form = null;

    txz.initHeader({
        nav: [{
            name: '票券管理',
            href: '${ctx}/coupon/coupon/list.do',
        }, {
            name: '${empty coupon.id ? '发布' : '编辑'}票券',
            curr: true
        }],
        btns: [{
            type: 'back'
        }]
    });

    $(function () {
        layui.use(['form', 'laydate'], function () {
            form = layui.form, laydate = layui.laydate;

            // 查询开始日期
            var start = {
                elem: '#startTime'
            };

            var end = {
                elem: '#endTime'
            };
            laydate.render(start);
            laydate.render(end);

            //自定义验证规则
            form.verify({
                name: function (value) {
                    if (value == "") {
                        return '请填写名称';
                    }
                },
                pic: function (value) {
                    if (value == "") {
                        return "请上传图片";
                    }
                },
                remarks: function (value) {
                    if (value == "") {
                        return '请填写基本说明';
                    }
                },
                explain: function (value) {
                    if (value == "") {
                        return '请填写概要说明';
                    }
                }
            });

            //监听提交
            form.on('submit', function (data) {
                txz.submitObject(data.elem, function (callBack) {
                    var action = $("#myForm").attr("action");
                    $.post(action, $('#myForm').serialize(), function (res) {
                        typeof callBack === 'function' && callBack();
                        if (res.success) {
                            util.layerMsgSuccess("提交成功", function () {
                                location.href = "${ctx}/coupon/coupon/list.do";
                            });
                        } else {
                            util.layerMsgError("提交失败")
                        }
                    });
                });
                return false;
            });
        });
        $('#sel_pic_img').click(function () {
            txz.openSelImg({
                min: 1,
                max: 1,
                info: '建议尺寸：800x450',
                type: '<%=TargetType.COUPON.getCode()%>',
                cb: function (imgs) {
                    $('#cover-img').css('background-image', 'url(' + imgs[0].path + ')');
                    $('#pic').val(imgs[0].path);
                }
            })
        })
    })
</script>
</body>
</html>